﻿@page "/"
@layout FrontLayout
@inject NavigationManager NavigationManager


<PageTitle>爱看剧</PageTitle>

<div class="home" style="margin: 20px 25px">
    <!-- 头部 -->
    <div class="head" style="display: flex; flex-direction: row; justify-content: space-between">
        <div class="" style="padding: 2px 10px; text-align: center">
            <h1 style="margin: 20px 0; font-size: 38px; color: darkorange">
                爱看剧
            </h1>
            <div style="line-height: 10px; color: #0bbdd4;">
                <p class="">那些年陪伴我们成长的经典影视剧盘点</p>
                <p class="">重温经典、重获喜悦与感动</p>
            </div>
        </div>

        @*<div class="" style="display: flex; align-items: center; padding-right: 10px;">
        <div id="search-box">
        <input class="search-input" type="search" name="search" placeholder="请输入关键字" />
        <div id="search">搜索</div>
        </div>
        </div>*@
    </div>

    <!-- 主内容 -->
    <div class="main" style="margin: 2% 0;">
        <MRow>
            <MCol Md="3">
                <div class="link-card card-teleplay" @onclick="GoToTeleplay">
                    <span class="link-card-name">电视剧</span>
                </div>
            </MCol>
            <MCol Md="3">
                <div class="link-card card-movie" @onclick="GoToMovie">
                    <span class="link-card-name">电影</span>
                </div>
            </MCol>
            <MCol Md="3">
                <div class="link-card card-animation" @onclick="GoToAnimation">
                    <span class="link-card-name">动漫</span>
                </div>
            </MCol>

        </MRow>
    </div>
</div>


@code {
    private void GoToTeleplay()
    {
        NavigationManager.NavigateTo("teleplay");
    }
    private void GoToMovie()
    {
        NavigationManager.NavigateTo("movie");
    }
    private void GoToAnimation()
    {
        NavigationManager.NavigateTo("animation");
    }
}